<template>
	<view class="box">
		<view class="my-header w100">
			<view class="status_bar bg-blue w100" :style="'height:'+height+'px;'">
			</view>
			<view class="flex plr-36" style="height: 88rpx;">
				<u-icon name="arrow-left" color="#fff" size="40" @click="back"></u-icon>
				<view class="size-34 bold white">
					个人中心
				</view>
				<view style="width: 40rpx;height: 40rpx;"></view>
			</view>
			<view class="ptb-30" @click="goLogin">
				<view class="center">
					<image :src="token || tok ? imgUrl+info.avatar : '../../static/home-user.png'" mode=""></image>
				</view>
				<view class="ptb-30 bold text-center white">
					{{token || tok ? userInfo.nickname || info.nickname:'未登录，请点击登录'}}
				</view>
			</view>
		</view>

		<view class="w100 mt-20 bg-white flex1 img flex-wrap">
			<view class="nav-list text-center pt-20 pb-30  ">
				<navigator gator hover-class="none" url="/pages/my/order/dj-order">
					<image src="../../static/my-icon-1.png" mode=""></image>
					<view class="">
						我的订单
					</view>
				</navigator>
			</view>
			<view class="nav-list text-center pt-20 pb-30  ">
				<navigator hover-class="none" url="/pages/my/coupon/index">
					<image src="../../static/my-icon-4.png" mode=""></image>
					<view class="">
						优惠券
					</view>
				</navigator>
			</view>

			<view @click="call" class="nav-list text-center pt-20 pb-30 ">
				<image src="../../static/my-icon-7.png" mode=""></image>
				<view class="">
					联系客服
				</view>
			</view>
			<view class="nav-list text-center pt-20 pb-30 " @click="goSet">
				<image src="../../static/my-icon-8.png" mode=""></image>
				<view class="">
					基本设置
				</view>
			</view>

			<view class="nav-list text-center pt-20 pb-30 " @click="goInvoice">
				<image src="../../static/fapiao.png" mode=""></image>
				<view class="">
					开发票
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		mapState
	} from 'vuex';
	export default {
		data() {
			return {
				fee: '', //平台服务费
				income: '', //累计收入
				money: '', //可提现金额
				today_money: '', //今日收入
				IDcard: '未认证',
				Driver: '未认证',
				Owner: '',
				show: false, //支付
				show1: true,
				info:{},
				tok:''
			}
		},
		computed: {
			...mapState(['userInfo', 'token', 'height', 'tabList']),
		},
		onLoad() {},
		onShow() {
			this.info = uni.getStorageSync('userInfo')
			this.tok = uni.getStorageSync('token')
		},
		methods: {
			call() {
				// this.$http('/addons/ddrive/user/consumer_hotline', {}, "POST").then(data => {
				// 	uni.makePhoneCall({
				// 		phoneNumber: data.tel //仅为示例
				// 	});
				// })
				uni.makePhoneCall({
					phoneNumber: '10010' //仅为示例
				});
			},
			back() {
				uni.navigateBack({})
			},
			goLogin() {
				if (!this.token) {
					uni.navigateTo({
						url: '/pages/login/index'
					})
				}
			},
			goSet() { //设置
				uni.navigateTo({
					url: '/pages/my/set/index'
				})
			},

			goInvoice() {
				uni.navigateTo({
					url: '/pages/my/invoice/invoice'
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	page {
		background: #ffffff;
	}

	.box {
		width: 100%;
		height: 100vh;
		// background: #F8F8F8;
		// overflow: hidden;

		.my-header {
			background-color: #014495;
			background-size: 100% 100%;
			overflow: hidden;

			.status_bar {
				background: none;
			}

			image {
				width: 104rpx;
				height: 104rpx;
			}
		}

		.nav {
			margin-top: -30rpx;
			border-radius: 10rpx 10rpx 0 0;
		}

		.nav-list {
			width: 33.3333%;
		}

		.img {
			image {
				width: 60rpx;
				height: 60rpx;
			}
		}
	}
</style>
